<template>
  <div>
    <h2>上传视频和图片</h2>
    <form @submit.prevent="handleSubmit">
      <div>
        <label for="video">选择视频文件:</label>
        <input type="file" id="video" ref="videoFile" required />
      </div>
      <div>
        <label for="image">选择图片文件:</label>
        <input type="file" id="image" ref="imageFile" required />
      </div>
      <button type="submit">上传</button>
    </form>
    <p v-if="message">{{ message }}</p>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      message: ''
    };
  },
  methods: {
    async handleSubmit() {
      // 固定填充数据
      const videoName = '示例视频';
      const authorName = '示例作者';
      const authorUUID = '1234567890abcdef';
      const createTime = new Date().toISOString();
      const tags = 'tag1,tag2,tag3';

      const formData = new FormData();
      formData.append('videoFile', this.$refs.videoFile.files[0]);
      formData.append('imageFile', this.$refs.imageFile.files[0]);
      formData.append('videoName', videoName);
      formData.append('authorName', authorName);
      formData.append('authorUUID', authorUUID);
      formData.append('createTime', createTime);
      formData.append('tags', tags);

      try {
        const response = await axios.post('http://localhost:8888/video/upload', formData, {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        });
        this.message = response.data.message || '上传成功！';
      } catch (error) {
        console.error('上传失败:', error);
        this.message = '上传失败，请重试。';
      }
    }
  }
};
</script>

<style scoped>
/* Add your styles here */
</style>